<template>
	<view class="container">
		<view class="login-box">
			<!-- 登录标题居中 -->
			<h1 class="login-title">公司端登录</h1>

			<!-- 输入框 -->
			<view class="input-group">
				<text class="label">公司账户</text>
				<input v-model="companyAccount" class="input" type="text" placeholder="请输入公司账户" />
			</view>

			<view class="input-group">
				<text class="label">公司密码</text>
				<input v-model="companyPassword" class="input" type="password" placeholder="请输入公司密码" />
			</view>

			<!-- 登录按钮 -->
			<button class="login-btn" @click="handleLogin">登录</button>
			<!-- 跳转到注册页面按钮 -->
			<view class="register-link">
				<text @click="goToRegister">还没有账号？点击注册</text>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				companyAccount: '', // 存储公司账户
				companyPassword: '' // 存储公司密码
			};
		},
		methods: {
			// 登录按钮点击事件
			handleLogin() {
				// 检查输入是否为空
				if (!this.companyAccount || !this.companyPassword) {
					uni.showToast({
						title: '请输入账号和密码',
						icon: 'none'
					});
					return;
				}

				// 发送登录请求到后端
				this.loginRequest(this.companyAccount, this.companyPassword);
			},

			// 向后端发送登录请求
			loginRequest() {
				uni.request({
					url: 'api/recruit-CompanyLogin/company/companyLogin', // 后端登录接口
					method: 'GET',
					data: {
						companyAccount: this.companyAccount,
						companyPassword: this.companyPassword
					},
					success: (res) => {
						if (res.data.code === 200) {
							console.log(res.data)
							const token = res.data.data.token
							// 登录成功，跳转到主页
							uni.setStorageSync('computer', res.data.data);
							uni.setStorageSync('token', token);
							uni.navigateTo({
								url: '/pages/companyRegister/companyRegister' // 假设成功后跳转到主页
							});
						} else {
							uni.showToast({
								title: res.data.message || '登录失败',
								icon: 'none'
							});
						}
					},
					fail: (err) => {
						uni.showToast({
							title: '网络错误，请稍后再试',
							icon: 'none'
						});
					}
				});
			},

			// 跳转到注册页面
			goToRegister() {
				uni.navigateTo({
					url: '/pages/companyRegister/companyRegister'
				});
			}
		}
	};
</script>

<style scoped>
	.container {
		padding: 20px;
		display: flex;
		justify-content: center;
		align-items: center;
		height: 100vh;
	}

	.login-box {
		width: 80%;
		max-width: 400px;
		padding: 20px;
		border-radius: 10px;
		box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
		background-color: #ffffff;
		display: flex;
		flex-direction: column;
		justify-content: center;
	}

	.login-title {
		text-align: center;
		/* 居中显示标题 */
		font-size: 24px;
		font-weight: bold;
		margin-bottom: 30px;
	}

	.input-group {
		margin-bottom: 20px;
	}

	.label {
		display: block;
		font-size: 16px;
		margin-bottom: 8px;
	}

	.input {
		width: 100%;
		padding: 10px;
		font-size: 16px;
		border: 1px solid #ccc;
		border-radius: 5px;
	}

	.login-btn {
		width: 100%;
		padding: 12px;
		background-color: #007aff;
		color: white;
		font-size: 16px;
		border-radius: 5px;
		border: none;
		margin-top: 20px;
	}

	.register-link {
		margin-top: 20px;
		text-align: center;
	}

	.register-link text {
		color: #007aff;
		font-size: 14px;
		text-decoration: underline;
		cursor: pointer;
	}
</style>